<html>
	<title>记事本</title>
	<body>
		<div id="app">
			<div>
				<input type='text' v-model="inputValue" @keyup.enter='add'/>
				<ul>
					<li v-for="(item,index) in arr">
						{{index +1}}、{{item}} <a href="#" @click=del(index)>X</a>
					</li>
					<li v-if="arr.length!=0"><span>有{{arr.length}}条，</span> <span><a href="#" @click="clear">clear</a></span></li>
				</ul>
				
			</div>
		</div>
		<script  src='./js/vue.js'></script>
		<script>
			var app = new Vue({
				el:'#app',
				data:{
					arr:['点X删除我','clear清除全部'],
					inputValue:'回车新增'
				},
				methods:{
					add:function(){
						this.arr.push(this.inputValue);
						this.inputValue = ''
					},
					del:function(index){
						this.arr.splice(index,1);
					},
					clear:function(){
						this.arr = [];
					}
				}
			}) 
		</script>
	
	</body>
</html>